<!DOCTYPE html>
<html>
<head>
	<title>选择题</title>
    <style>
        body {
            padding: 0 100px;
        }
        div {
            margin-bottom: 30px;
        }
    </style>
</head>
<body>

	<h1>选择题</h1>
    <main id="main"></main>
    <form>
      <!-- <p>1</p>
      <p>题目</p>
      <input type="text">A
      <input type="text">B
      <input type="text">C
      <input type="text">D -->
    </form>
	
	<button onclick="submitAnswers()">提交答案</button>

	<p id="score"></p>

	<script>
		function submitAnswers() {

		}
        const list = [
            {
                id: '001',
                titile: '在下列哪个选项中，typeof 返回的值为 "object"？',
                options: [
                    { op:  'A', value: 'null'},
                    { op:  'B', value: 'undefined'},
                    { op:  'C', value: 'function'},
                    { op:  'D', value: 'string'}
                ]
            },
            {
                id: '002',
                titile: '下列哪个方法可以用于删除一个对象的属性？',
                options: [
                    { op:  'A', value: 'object.remove(property)'},
                    { op:  'B', value: 'object.delete(property)'},
                    { op:  'C', value: 'delete object.property'},
                    { op:  'D', value: 'object.pop(property)'}
                ]
            },
            {
                id: '003',
                titile: '下列哪个方法可以用于在数组的末尾添加一个新元素？',
                options: [
                    { op:  'A', value: 'array.add(newElement)'},
                    { op:  'B', value: 'array.insert(newElement)'},
                    { op:  'C', value: 'array.push(newElement)'},
                    { op:  'D', value: 'array.unshift(newElement)'}
                ]
            }
        ]
        const answer = {
            '001': 'A',
            '002': 'C',
            '003': 'C'
        }
       let result= list.map(item=>{
          return  `
          <p>${item.id}</p>
      <p>${item.titile}</p>
      ${item.options.map(item=>{
       
        return `
        <input type='radio'>
        ${item.op}
        ${item.value}
       ` 
      }).join('')}
      ${item.options.map(item=>{
        item.value
      })}
          `
        }).join('')
        document.querySelector('form').innerHTML=result
        
    </script>

</body>
</html>
